import React, { Component } from 'react';
import { List , Scroller} from '$yo-component';
import Header from '$component/header/index.js';
import yoHistory from '$common/history';
import './index.scss';


var Obj = React.createClass({
    getInitialState:function(){
        return {
            dataObj:[{origin:"origin"}],
            renderPage:""
        }
    },
    componentWillMount:function(){
        var self = this;
        fetch('../mock/obj.json')
        .then(function(response) {
            if (response.status >= 400) {
                throw new Error("Bad response from server");
            }
            return response.json();
        })
        .then(function(stories) {
            self.setState({
                dataObj:stories
            })
            
        });
        
    },
    render:function() { 
        return (
            <div className="yo-flex">
                <Scroller>
                    <div className="skillCom flex">
                        <List
                            dataSource={this.state.dataObj}
                            renderItem={(item,i)=>{
                                return (
                                    <div>
                                        <div className="listImgBox">
                                            <img src={item.src}/>
                                        </div>
                                        <div className="listTextBox">
                                            <h3>{item.name}</h3>
                                            <p>{item.detail}</p>
                                            <p className="addCont">
                                                <span>类型:{item.category}</span>
                                                <span>点赞：{item.point}</span>
                                            </p>
                                        </div>
                                    </div>
                                )
                            }}
                        />
                    </div>

                </Scroller>
            </div>
        )
    }
})


export default Obj;
